function collision() {
    let canvas = document.getElementById("_canvas");
    let ctx = canvas.getContext("2d");
    let engine = new Engine(ctx);
    let layer = new Layer(ctx); 

    layer.create = function () {
        let rect1 = new RectObject();
        rect1.width = 200;
        rect1.height = 50;
        rect1.x = 100;
        rect1.y = 100;
        rect1.rotation = Math.PI / 1.5;
        layer.addObject(rect1);

        let arc1 = new ArcObject();
        arc1.radius = 50;
        arc1.x = 500;
        arc1.y = 100;
        arc1.speed = 5;
        arc1.addComponent(new GameComponent.WSADMove(15));
        layer.addObject(arc1);

        let rect2 = new RectObject();
        rect2.width = 200;
        rect2.height = 100;
        rect2.x = 300;
        rect2.y = 200;
        rect2.addComponent(new GameComponent.MouseDrag());

        let tip1 = new TextObject('碰到矩形了');
        tip1.x = 400;
        tip1.y = 400;
        let tip2 = new TextObject('碰到圆形了');
        tip2.x = 400;
        tip2.y = 450;

        rect2.update = function () {
            layer.removeObject(tip1);
            layer.removeObject(tip2);

            arc1.strokeStyle = 'black';
            rect1.strokeStyle = 'black';
            rect2.strokeStyle = 'black';

            if (CollisionUtil.metting(rect1, rect2)) {
                rect1.strokeStyle = 'red';
                rect2.strokeStyle = 'red';
                layer.addObject(tip1);
            }

            if (CollisionUtil.metting(arc1, rect2)) {
                arc1.strokeStyle = 'red';
                rect2.strokeStyle = 'red';
                layer.addObject(tip2);
            }
        }
        layer.addObject(rect2);
    }
    engine.addLayer(layer);
    engine.run();
    return engine;
}
